/**
 * @fileOverview
 * @author iNahoo
 * @since 2018/4/24.
 */
"use strict";

import React, {PureComponent, Component} from 'react';
import ReactDOM from 'react-dom';

class Sub1 extends Component {
    render() {
        return <div>Sub1</div>
    }
}

class Sub2 extends Component {
    render() {
        return <div>Sub2</div>
    }
}

const AddMainContent = (component, text) => {
    return class extends Component {
        constructor(props) {
            super(props);
            this.state = {
                text,
            }
        }

        render() {
            return <component onClick={() => alert(this.state.text)}></component>
        }
    }
};

const creatDiv = (text) => {
    return class extends Component {
        render() {
            return <div>{text}</div>
        }
    }
};

class Wrapper extends Component {
    render() {
        console.log(this.props);
        return <div>{this.props.children}</div>
    }
}

class Main extends Component {

    render() {
        let NS = [1, 2, 3, 4, 5, 6].map(i => {
            const N = creatDiv(i);
            return <N key={i}></N>
        });

        return <Wrapper>
            {NS}
        </Wrapper>;
    }
}

ReactDOM.render(
    <Main></Main>,
    document.getElementById('app')
);


